{% extends "templates/atnet_base.html" %}

{% block csslink %}
{{ super() }}
<script src="/media/js/jquery.js"></script>

{% include 'templates/includes_datatable.html' %}
{% include 'templates/includes_jquery_ui.html' %}
<script src="/media/js/form_popup.js"></script>

<script type="text/javascript" charset="utf-8">
	$(document).ready(function() {
		$('#lot_owners').dataTable({
			"bPaginate": false,
			"bLengthChange": false,
			"bFilter": true,
			"bSort": true,
			"bInfo": true,
			"bAutoWidth": false,
			"oLanguage": {
                "sUrl": "/media/js/dataTables.{{ app_user.lang }}.txt"
            },
    		"bProcessing": true,
    		"sAjaxSource": "{{ uri_for('creation_lotowners', imm_id=immeuble.key().id(), command='list_json') }}",
    		"fnRowCallback": function( nRow, aData, iDisplayIndex ) {
    			$('td:eq(6)', nRow).html('<a href="javascript:void(0);" id="' + aData[6] + '" class="edit">{{ _("Assign/Unassign") }}</a>');
    			$('td:eq(7)', nRow).html('<a href="javascript:void(0);" id="' + aData[7] + '" class="duplicate">{{ _("Duplicate") }}</a>');
    		},
		});
		$('#lot_owners tbody tr a').live('click', function(e){
			if ($(this).attr('class') == 'edit') {
				$(this).LaunchPopup(
					{
						TableId: '#lots, #lot_owners',
						DivId: '#dialog-form',
						FormId: '#generated-form',
						UrlForm: '{{ uri_for("creation_lotowners", imm_id=app_user.last_active_immeuble_id, command="edit") }}' + e.target.id + '/',     
						Mode: 'edit',
						Title: '{{ _("Edit lot owner") }}',
					})
				}
			if ($(this).attr('class') == 'duplicate') {
				$(this).LaunchPopup(
						{
							TableId: '#lots, #lot_owners',
							DivId: '#dialog-form',
							FormId: '#generated-form',
							UrlForm: "{{ uri_for('creation_lotowners', imm_id=immeuble.key().id(), command='add') }}" + e.target.id + "/",
							Mode: 'add',
							Title: '{{ _("Add lot owner") }}'
						})
			}
		});

		$('#lots').dataTable({
			"bPaginate": false,
			"bLengthChange": false,
			"bFilter": true,
			"bSort": true,
			"bInfo": true,
			"bAutoWidth": false,
			"oLanguage": {
				"sUrl": "/media/js/dataTables.{{ app_user.lang }}.txt"
			},
			"bProcessing": true,
			"sAjaxSource": "{{ uri_for('creation_lots', imm_id=immeuble.key().id(), command='list_wo_owners_json') }}",
		});

		$("#generated-form").ajaxComplete(function() {
			$(this).find('#owner').parent().append("<br />");
			$(this).find('#owner').parent().append("<a href='javascript:void(0);' id='contact-add-person'>" + "{{ _("Add person") }}" + "</a>");
			$(this).find('#owner').parent().append("<br />");
			$(this).find('#owner').parent().append("<a href='javascript:void(0);' id='contact-add-company'>" + "{{ _("Add company") }}" + "</a>");
		});

		$('#contact-add-person').live('click', function(){
			$("#dialog-form").dialog("close"); // or hide to keep already entered data
			$(this).LaunchPopup(
				{
					DivId: '#dialog-form1',
					FormId: '#generated-form1',
					UrlForm: "{{ uri_for('vie_contacts', imm_id=immeuble.key().id(), command='add_person') }}",
					Mode: 'add',
					Title: '{{ _("Add person") }}',
					ControlId: '#add-ba'
				}
			)
		});
		
		$('#contact-add-company').live('click', function(){
			$("#dialog-form").dialog("close");
			$(this).LaunchPopup(
				{
					DivId: '#dialog-form1',
					FormId: '#generated-form1',
					UrlForm: "{{ uri_for('vie_contacts', imm_id=immeuble.key().id(), command='add_company') }}",
					Mode: 'add',
					Title: '{{ _("Add company") }}',
					ControlId: '#add-ba'
				}
			)
		});

		$('#add-lotowner').live('click', function(){
			obj_id = 0;
			$(this).CallAddPopup();
		});
		
		$.fn.SecondPopupClose = function() {
			if (obj_id == 0)
				$(this).CallAddPopup();
			else
				$(this).CallEditPopup(obj_id);
		};
		
		$.fn.CallAddPopup = function() {
			$('#generated-form').html('');
			$(this).LaunchPopup(
					{
						TableId: '#lots, #lot_owners',
						DivId: '#dialog-form',
						FormId: '#generated-form',
						UrlForm: "{{ uri_for('creation_lotowners', imm_id=immeuble.key().id(), command='add') }}",
						Mode: 'add',
						Title: '{{ _("Add lot owner") }}'
					}
				)
		};
		
		$.fn.CallEditPopup = function() {
			$('#generated-form').html('');
			$(this).LaunchPopup(
					{
						TableId: '#lots, #lot_owners',
						DivId: '#dialog-form',
						FormId: '#generated-form',
						UrlForm: "{{ uri_for('creation_lotowners', imm_id=immeuble.key().id(), command='edit') }}" + obj_id + "/",
						Mode: 'edit',
						Title: '{{ _("Edit lot owner") }}'
					}
				)
		};

	});
</script>
{% endblock %}

{% block title %} 
	{{ title }}
{% endblock %}

{% block header %}
{{ header }}
{% endblock %}

{% block login%}
{% if show_login %}
{{ super() }}
{% endif %}
{% endblock%}

{% block navigation %}
{{ super() }}
{% endblock %}

{% block section_menu %}
{% include 'templates/includes_creation_menu.html' %}
{% endblock %}

{% block main_content %}
<p>
	<div id="demo">
	<a href="{{ uri_for('reports_web', imm_id=immeuble.key().id(), command='lots') }}" target="_blank">{{ _('Preview') }}</a> || 
	<a href="{{ uri_for('reports_web', imm_id=immeuble.key().id(), command='lots') }}?format=pdf" target="_blank">{{ _('Print') }}</a>
	<br /><br />
	<fieldset>
	<legend>{{ _('List of lots and lot owners') }}</legend>
<!--	<div>
	  	<a href="javascript:void(0);" id="add-lotowner">{{ _('Add lot owner') }}</a> 
	</div>
-->
	<br/>
	<table cellpadding="0" cellspacing="0" border="0" class="display" id="lot_owners" width="100%">
		<thead>
			<tr>
				<th>{{ _(fields.owner) }}</th>
				<th>{{ _(fields.code) }}</th>
				<th>{{ _(fields.lot_number) }}</th>
				<th>{{ _(fields.purchase_date) }}</th>
				<th>{{ _(fields.sale_date) }}</th>
				<th>{{ _(fields.occupant) }}</th>
				<th></th>
				<th></th>
			</tr>
		</thead>
		<tbody>
		</tbody>
		<tfoot>
			<tr>
				<th>{{ _(fields.owner) }}</th>
				<th>{{ _(fields.code) }}</th>
				<th>{{ _(fields.lot_number) }}</th>
				<th>{{ _(fields.purchase_date) }}</th>
				<th>{{ _(fields.sale_date) }}</th>
				<th>{{ _(fields.occupant) }}</th>
				<th></th>
				<th></th>
			</tr>
		</tfoot>
	</table>
	</fieldset>
	</div>
	<br/><br/>
	<div>
	<fieldset>
	<legend>{{ _('List of lots') }}</legend>
	<table cellpadding="0" cellspacing="0" border="0" class="display" id="lots" width="100%">
		<thead>
			<tr>
				<th>{{ _(fields.number) }}</th>
				<th>{{ _(fields.building) }}</th>
				<th>{{ _(fields.lot) }}</th>
				<th>{{ _(fields.escalier) }}</th>
				<th>{{ _(fields.etage) }}</th>
				<th>{{ _(fields.surface) }}</th>
			</tr>
		</thead>
		<tbody>
		</tbody>
		<tfoot>
			<tr>
				<th>{{ _(fields.number) }}</th>
				<th>{{ _(fields.building) }}</th>
				<th>{{ _(fields.lot) }}</th>
				<th>{{ _(fields.escalier) }}</th>
				<th>{{ _(fields.etage) }}</th>
				<th>{{ _(fields.surface) }}</th>
			</tr>
		</tfoot>
	</table>
	</fieldset>
	</div>
	{% include 'templates/includes_popup_form.html' %}
	{% include 'templates/includes_popup_form1.html' %}
</p>
<script>
$(function() {
	var user_lang = "{{ app_user.lang }}";
	if (user_lang == "en") { user_lang = "en-GB" };
	$.datepicker.setDefaults( $.datepicker.regional[ user_lang ] );
	
	$("#purchase_date").live("focus", function() {
	    $(this).datepicker({
	        inline: true,
	    });
	});
	$("#sale_date").live("focus", function() {
	    $(this).datepicker({
	        inline: true 
	    });
	});
	$("#birthday").live("focus", function() {
	    $(this).datepicker({
	        inline: true 
	    });
	});
});
</script>
{% endblock %}
